<!DOCTYPE html>
<html ng-app>

<head lang="en">
    <meta charset="UTF-8">
    <title>学生主页</title>
    <link href="./css/bootstrap.min.css" rel="stylesheet">
    <link href="./css/font-awesome.css" rel="stylesheet">
    <link href="./css/main.css" rel="stylesheet">
    <script src="./js/jquery.min.js"></script>
    <script src="./js/bootstrap.min.js"></script>
    <script src="./js/jquery.pin.js"></script>
	<script src="js/angular.min.js"></script>

</head>

<body ng-controller="student">

    <!--导航栏-->
    <div class="navbar navbar-njust navbar-fixed" role="navigation">
        <div class="container clearfix">
            <div class="navbar-header">

                <div class="navbar-brand">
                    <i class="fa fa-cubes"></i>
                    <h4 id="maintitle">课程考试系统</h4>
                </div>
            </div>

            <div class="navbar-collapse collapse">

                <ul class="nav navbar-nav" style="margin-left:400px">
                    <li class="pull-left">
                        <a href="home.html">首页</a>
                    </li>

                    <li class="pull-left active">
                        <a href="student.html">学生页面</a>
                    </li>

                </ul>
                <div class="list-unstyled pull-right clearfix dropdown" style="margin-top:25px">
                    <li class="dropdown-toggle " id="dropdownMenu1" data-toggle="dropdown">
                        <a href="" style="width:200px">欢迎您，<span id="username">{{student.name}}</span>学生</a>
                    </li>
                    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                        <li role="presentation"><a role="menuitem" tabindex="-1" href="studentEditInfo.html">我的账户</a>
                        </li>
                        <li role="presentation"><a  id = "logoutBtn" role="menuitem" tabindex="-1" href="student!logout.action">注销</a>
                        </li>
                    </ul>
                </div>
            </div>
        
		</div>
	</div>

    <div class="container" id="main-wrapper">
        <div class="bs-sidebar hidden-print toc affix-top list-group" data-spy="affix" data-offset-top="120" role="complementary">
            <div class="nav bs-sidenav pinned" style="width:210px;margin-top:50px">

                <a class="item-l1 list-group-item" href="#info">个人信息</a>
                <a class="item-l2 list-group-item" href="#course">已选课程</a>
				<a class="item-l3 list-group-item" href="#exam">我的考试</a>

            </div>
        </div>
        
		<div class="content-body" role="main">
            <h1 id="info">个人信息</h1>
            <p>学生学号 : <span id = "userid">{{student.studentNo}}</span></p>
            <p>所属学院 : <span id = "usercollege">{{student.college}}</span></p>
            <p>学生年级 : <span id = "usergrade">{{student.grade}}</span></p>
            <p>学生姓名 : <span id = "usernamer">{{student.name}}</span></p>
            <p>联系方式 : <span id = "usercontact">{{student.contact}}</span></p>
            
			<h1 id="course">已选课程</h1>
            <table>
                <thead>
                    <tr>
                        <th>课程ID</th>
                        <th>课程名称</th>
                        <th>分数</th>
                    </tr>
                </thead>
                <tbody id="courseTable">
                    <tr ng-repeat="course in courses">
                        <td>{{course.courseNo}}</td>
                        <td>{{course.courseName}}</td>
                        <td>{{course.score}}</td>
                    </tr>
                </tbody>
            </table>

			<h1 id="exam">我的考试</h1>
            <table>
                <thead>
                    <tr>
                        <th>考试ID</th>
                        <th>课程名称</th>
                        <th>考试名称</th>
                        <th>考试时间</th>
                        <th>考试状态</th>
                    </tr>
                </thead>
                <tbody id="examTable">
                    <tr ng-repeat="exam in exams">
                        <td>{{exam.examNo}}</td>
                        <td>{{exam.courseNo}}</td>
                        <td>{{exam.examName}}</td>
                        <td>{{exam.startTime}}</td>
                        <td>{{exam.state}}</td>
                    </tr>
					<tr>
                        <td>04</td>
                        <td>软件项目管理</td>
                        <td>欢乐考试</td>
                        <td>2014.12.17日12:00</td>
                        <td>正在进行  <a href="exam.html">  进入</a></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>

    <script>
        $(".pinned").pin({
            containerSelector: ".container"
        });
    </script>
	
    <footer class="footer clearfix">
        <div class="container">
            <ul class="list-unstyled list-inline pull-left">
                <li>
                    <a href="#">FAQ</a>
                </li>
                <li>
                    <a href="#">Git</a>
                </li>
                <li>
                    <a href="#">Blog</a>
                </li>
            </ul>
            <p class="pull-right">@ 2014 软件项目管理团队</p>

        </div>
    </footer>

<!--jq get data-->
<!--script type="text/javascript">
window.onload=function(){
    var user;
    getSessionUser();
   
    $.getJSON("student!getSessionUserInfo.action",{},function(data){
        setCourse(data.curilist,data.courseNo); 	
    });
    $.getJSON("student!getSessionExam.action",{},function(data){
    	//alert(data.exam.length + " " + data.exam[0].courseNo);
    	setExam(data.exam);
    });
}
function getSessionUser(){
    $.getJSON("student!getSessionUser.action",{},function(data){
        user = data.user;
        document.getElementById('username').innerHTML = user.name;
        document.getElementById('userid').innerHTML = user.name;
        document.getElementById('usercollege').innerHTML = user.college;
        document.getElementById('usergrade').innerHTML = user.grade;
        document.getElementById('usernamer').innerHTML = user.name;
        document.getElementById('usercontact').innerHTML = user.contact;    
    });
};

function setExam(curi){
    var content="";
    var state="";
    //alert(curi.length);
    for (var i=0;i<curi.length;i++){
    	//alert(curi[i]);
      if (curi[i].state=='END') state="已结束";
        else if (curi[i].state=='Running') state="正在进行";
        else state="准备中";
        content+='<tr>'+
                        '<td>'+ ' ' + curi[i].examNo +'</td>'+
                        '<td>'+ ' ' + curi[i].courseNo +'</td>'+
                        '<td>'+ ' ' + curi[i].examName +'</td>'+
                        '<td>'+ ' ' +'</td>';
        if (state=="正在进行"){
            content +=   '<td>'+ ' ' +state+"...."+
            	'<a href="exam.html">' +"进入考试"+ '</a>'+
            	'</td>' + '</tr>';
        }else {
            content += '<td>' + ' ' +state+'</td>'+
                    '</tr>';
        }
    }
	if ( curi.length==0 ) content += 'Empty !';
	$("#examTable").html(content);
}

function setCourse(curi,cou){
	var content = "";
    //alert( curi.length + " " + cou.length + " " + curi[1].id.courseNo + " " + cou[1].courseName + " " + content);
	for(var i=0;i<curi.length;i++){
        //alert("操作" + i + " " + content);
		content += '<tr>'+
						'<td>'+ ' ' + curi[i].id.courseNo +'</td>'+
						'<td>'+ ' ' + cou[i].courseName +'</td>'+
						'<td>'+ ' ' +'</td>'+
					'</tr>';
	}
    //alert( curi.length + " " + curi[0].id.courseNo + " " + cou[0].courseName + " " + content);
	if ( curi.length==0 ) content += 'Empty !';
	$("#courseTable").html(content);
}

$("#logoutBtn").click(function (){
        $.post("student!logout.action",
                {
                },
                function(logindata){
                    window.location.href="home.html";
                    
                }
        );
});

</script-->

	<!-- angular -->
	<script>
		function student($scope,$http){
			var student = new Object();
			var exams = new Array();
			var courses = new Array();
			
			$scope.student = student;
			$scope.exams = exams;
			$scope.courses = courses;
			
			//set static data
			student.name = '黄大队';
			student.studentNo = '9121068403xx';
			student.college = '皇家理工大学';
			student.grade = '二年级';
			student.contact = '672160';
			for(var i=0;i<2;i++){
				courses[i] = new Object();
				courses[i].courseNo = '0'+(i+1);
				courses[i].score = 95;
				courses[i] .courseName = '计算机组成原理';
			}
			for(var i=0;i<4;i++){
				exams[i] = new Object();
				exams[i].startTime = "2015/1/1-8:00";
				exams[i].examNo = '0'+i;
				exams[i].courseNo = "计算机组成原理";
				exams[i].examName = "欢乐考试";
				exams[i].state = "准备中";
			}
			
			
			//get active info
			$http.get("student!getInfo.action").success(function(data){
				$scope.student = student = angular.copy(data.student);
			}).error(function(){
				//alert('wocao fail');
			});
		}
	</script>
	
</body>

</html>